﻿@model Tuple<List<deviceManage.Models.DeviceType>
        , List<deviceManage.Models.Room>,List<deviceManage.Models.Depart>
        ,List<Project>
    >
    @{
        ViewData["Title"] = "综合查询";
    }

  

            <div class="layui-fluid">
                <div class="layui-card">
                    <div class="layui-form layui-card-header layuiadmin-card-header-auto search" lay-filter="app-content-list">
                        <table>
                            <tr>
                                <td>
                                    <div class="layui-inline">
                                        <label class="layui-form-label">设备名称</label>
                                        <div class="layui-input-inline">
                                            <input type="text" name="name" placeholder="请输入" autocomplete="off" class="layui-input">
                                        </div>
                                    </div>
                                    <div class="layui-inline">
                                        <label class="layui-form-label">设备编号</label>
                                        <div class="layui-input-inline">
                                            <input type="text" name="deviceId" placeholder="请输入" autocomplete="off" class="layui-input">
                                        </div>
                                    </div>

                                    <div class="layui-inline">
                                        <label class="layui-form-label">所在机房</label>
                                        <div class="layui-input-inline">
                                            <select name="roomId">
                                                <option></option>
                                                @foreach (var type in Model.Item2)
                                                {
                                                    <option value="@type.Id">@type.Name</option>
                                                }
                                            </select>
                                        </div>
                                    </div>
                                    <div class="layui-inline">
                                        <label class="layui-form-label">所属部门</label>
                                        <div class="layui-input-inline">
                                            <select name="departId">
                                                <option></option>
                                                @foreach (var type in Model.Item3)
                                                {
                                                    <option value="@type.Id">@type.Name</option>
                                                }
                                            </select>
                                        </div>
                                    </div>                                    
                                </td>
                                <td rowspan="2" style="padding-left:10px;">
                                    <button style="height:75px;padding: 0 10px;" class="layui-btn layuiadmin-btn-list" lay-submit="" lay-filter="search">
                                        <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>查询
                                    </button>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <div class="layui-inline">
                                        <label class="layui-form-label">设备类型</label>
                                        <div class="layui-input-inline">
                                            <select name="deviceTypeId">
                                                <option></option>
                                                @foreach (var type in Model.Item1)
                                                {
                                                    <option value="@type.Id">@type.Name</option>
                                                }
                                            </select>
                                        </div>
                                    </div>

                                    <div class="layui-inline">
                                        <label class="layui-form-label">采购日期</label>
                                        <div class="layui-input-inline">
                                            <input type="text" name="start" class="layui-input date" id="test-laydate-start" placeholder="开始日期" lay-key="122">
                                        </div>
                                        -
                                        <div class="layui-input-inline">
                                            <input type="text" name="end" class="layui-input date" id="test-laydate-end" placeholder="结束日期" lay-key="123">
                                        </div>
                                    </div>
                                    <div class="layui-inline">
                                        <label class="layui-form-label">固定资产编号</label>
                                        <div class="layui-input-inline" style="width:170px;">
                                            <input type="text" name="no" placeholder="请输入" autocomplete="off" class="layui-input">
                                        </div>
                                    </div>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <div class="layui-inline">
                                        <label class="layui-form-label">建设部门</label>
                                        <div class="layui-input-inline">
                                            <input type="text" name="owner_unit" placeholder="请输入" autocomplete="off" class="layui-input">
                                        </div>
                                    </div>
                                    <div class="layui-inline">
                                        <label class="layui-form-label">所属项目</label>
                                        <div class="layui-input-inline">
                                            <select name="projectId">
                                                <option></option>
                                                @foreach (var type in Model.Item4)
                                                {
                                                    <option value="@type.Id">@type.Name</option>
                                                }
                                            </select>
                                        </div>
                                    </div>
                                </td>
                            </tr>
                        </table>
                    </div>
                    

                    <div class="layui-card-body">
                        <div style="padding-bottom: 10px;">
                        </div>
                        <table id="deviceTable" lay-filter="deviceTable"></table>
                    </div>
                </div>
            </div>
     
    <script type="text/javascript" src="~/js/deviceState.js"></script>
    <script>
    var $ = layui.$
    var layer = layui.layer
        ,form = layui.form
        ,admin = layui.admin
        ,table = layui.table
        ,upload = layui.upload
        ,view = layui.view
        ,element = layui.element;


    

    var laydate = layui.laydate;
    var insStart = laydate.render({
        elem: '#test-laydate-start'
        , min: '1980-1-1'
        , done: function (value, date) {
            //更新结束日期的最小日期
            insEnd.config.min = lay.extend({}, date, {
                month: date.month - 1
            });

            //自动弹出结束日期的选择器
            insEnd.config.elem[0].focus();
        }
    });

    //结束日期
    var insEnd = laydate.render({
        elem: '#test-laydate-end'
        , min: '1980-1-1'
        , done: function (value, date) {
            //更新开始日期的最大日期
            insStart.config.max = lay.extend({}, date, {
                month: date.month - 1
            });
        }
    });

    form.render(null, 'app-content-list');

    //监听搜索
    form.on('submit(search)', function (data) {
        var field = data.field;
        //执行重载
        tableObj.reload(
           {
            where: field
        });
    });


   //加载table
    var tableObj= table.render({
            elem: '#deviceTable'
        , url: '/DeviceQuery/list/' //模拟接口
            ,method: 'post'
            , height:"full-196"
            , page: true
        , cols: [[
            { field: 'deviceName', title: '设备名称', minWidth: 180, templet: '<div><a class="link"  onclick="showDetail(\'{{d.id}}\')"  href="#">{{d.name}}</a></div>' }
            , { field: 'category', title: '设备类型分类', width: 120, templet: '<div>{{ getCategory(d.deviceType)}}</div>' }
            , { field: 'deviceType', title: '设备类型', width: 100, templet: '<div>{{ d.deviceType.name}}</div>' }
            , { field: 'model', title: '规格型号', width: 120, templet: '<div>{{ d.model}}</div>' }
            , { field: 'deviceId', title: '设备编号', width: 120, templet: '<div>{{ d.deviceId}}</div>' }
                , { field: 'name', title: '固定资产编号', width: 120, templet: '<div>{{ d.no}}</div>' }
                , { field: 'name', title: '所在机房', width: 120, templet: '<div>{{ d.room.name}}</div>' }
            , { field: 'name', title: '状态', width: 120, templet: '<div>{{ getDeviceState(d.status)}}</div>' }
            , { field: 'name', title: '所在部门', width: 120, templet: '<div>{{ getDepart(d.depart) }}</div>' }
                , { field: 'name', title: '采购日期', width: 120, templet: '<div>{{ getDate(d.buyDate)}}</div>' }
                , { field: 'name', title: '接管日期', width: 120, templet: '<div>{{ getDate(d.receiveDate)}}</div>' }
                , { field: 'name', title: '出保日期', width: 120, templet: '<div>{{ getDate(d.serviceDate) }}</div>' }

            ]]
            , skin: 'line'
        });



    function getDepart(depart) {
        if (depart != null) {
            return depart.name;
        } else {
            return "";
        }
    }

        function showDetail(id) {
            layer.open({
                mask: 0,
                type: 2,
                content: '/deviceInfo/Detail?id=' + id,
                area: ["1000px", "550px"]
            });
        }


        function getCategory(type) {
            if (type == null) return "";
            if (type.deviceTypeCategory == null) return "";
            return type.deviceTypeCategory.name;
        }
 
    </script>

